<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>维修维护计划</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <style type="text/css">
        .left-label {
            width: 100px !important
        }
    </style>
    <link rel="stylesheet" href="${pageContext.request.contextPath }/assets/css/layui.css"  media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath }/assets/css/toastr.min.css"  media="all">
</head>
<body>
<div class="demoTable" style="padding:10px 0 0 15px">
    <div class="layui-inline">
        <%--<input class="layui-input" name="searchTime" id="searchTime" placeholder="请输入时间检索" style="display: inline; width: 45%">--%>
        <input class="layui-input" name="keyword" id="keyword" placeholder="请输入设备名称" autocomplete="off" style="display: inline; width: 100%">
    </div>
    <button class="layui-btn layui-btn-blue" style="margin: 0 0 0 10px" data-type="reload"><i class="layui-icon layui-icon-search">搜索</i></button>
</div>
<table class="layui-hide" id="tableList" lay-filter="tableList"></table>
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-blue" lay-event="add"><i class="layui-icon layui-icon-add-1">  新增</i></button>
        <button class="layui-btn layui-btn-blue" lay-event="delete"><i class="layui-icon layui-icon-delete">批量删除</i></button>
    </div>
</script>

<script type="text/html" id="rowToolbar">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script src="${pageContext.request.contextPath }/assets/layui.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/assets/layui.all.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/assets/js/jquery.min.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/assets/js/toastr.min.js" charset="utf-8"></script>

<script type="text/javascript">
    layui.use(['table','layer','upload','form','laydate'], function(){
        var table = layui.table;
        var layer = layui.layer;
        var laydate = layui.laydate;
        var form = layui.form;

        var $ = layui.jquery, active = {
            reload:function () {
                /*var searchTime = $("#searchTime").val();*/
                var keyword01 = $("#keyword").val();
                /*console.log(searchTime + ',' + keyword)*/
                table.reload('contenttable',{
                    method:'get',
                    where:{"keyword01":keyword01},
					page: {
						curr: 1
					}
                });
            }
        }
        $('.layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        table.render({
            elem: '#tableList'
            ,url:'${pageContext.request.contextPath }/maintPlan/queryMaintenancePlan.do'
            ,toolbar: '#toolbar'
            ,title: '维修维护计划'
            ,id :'contenttable'
            ,limits:[10,20,30]
            ,cols: [[
                {type: 'checkbox', fixed: 'left'},
                {field:'', title:'序号', sort: true, type:'numbers', width: 60},
                {field:'deviceName', title:'设备名称', edit: 'text'},
                {field:'deviceNo', title:'设备编号', edit: 'text'},
                {field:'maintenanceContent', title:'维修维护内容'},
                {field:'maintenanceCycle', title:'周期'},
                {field:'maintenanceTime', title:'日期'},
                {field:'needMaterial', title:'所需材料'},
                {field:'unit', title:'单位'},
                {field:'counts', title:'数量'},
                {field:'workHours', title:'工时'},
                {field:'manPower', title:'人工'},
                {field:'cost', title:'费用(元)'},
                {field:'remark01', title:'录入人'},
                {fixed:'right',title:'操作', toolbar: '#rowToolbar', width: 120}
            ]],
            page: true
        });

        //头工具栏事件
        table.on('toolbar(tableList)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'add':
                    layer.open({
                        type: 1 					        //Page层类型
                        ,area: ['620px', '470px'] 	//宽  高
                        ,title: '新增'
                        ,shade: 0.6 				    //遮罩透明度
                        ,maxmin: true 				//允许全屏最小化
                        ,anim: 1 					    //0-6的动画形式，-1不开启
                        /* ,content: $("#addDivID") */
                        ,content: '<div id="addDivID">'+
                            '<form class="layui-form" id="addFormID">'+
		                    	'<br>'+
		                		'<table>'+
		                			'<tr>'+
		                				'<td><label class="layui-form-label left-label">设备编号</label></td>'+
	                		        	'<td>'+
                                            '<div style="width: 170px">'+
                                                '<div style="width: 150px; margin-left: 0px; float: left">' +
                                                    '<select class="layui-select" id="deviceNo" name="deviceNo" lay-filter="displayInfo" lay-verify="deviceNo">' +
                                                        '<option value="">请选择</option>' +
                                                    '</select>' +
                                                '</div>' +
                                                '<div style="margin-top: 9px; float: left">'+
                                                    '<font style="color:red; font-size: 24px; margin-left: 4px">*</font>'+
                                                '</div>'+
                                            '</div>' +
		                				'</td>'+
		                		        '<td><label class="layui-form-label left-label">设备名称</label></td>'+
		                		        '<td><input readonly class="layui-input" id="deviceName" name="deviceName" lay-verify="deviceName" style="width:150px; display: inline;">' +
                                            '<div class="layui-inline" style="margin-top: 4px;">'+
                                                '<font style="color:red; font-size: 24px; margin-left: 4px">*</font>'+
                                            '</div>'+
                                        '</td>'+
		                	        '</tr>'+
		                	       '<tr style="height:20px"></tr>'+
		                	        '<tr>'+
		                	        	'<td><label class="layui-form-label left-label">维护维修内容</label></td>'+
		                	        	'<td><input class="layui-input" id="maintenanceContent" name="maintenanceContent" lay-verify="maintenanceContent" style="width:150px"></td>'+
		                	        	'<td><label class="layui-form-label left-label">周期</label></td>'+
		                	        	'<td><input class="layui-input" id="maintenanceCycle" name="maintenanceCycle" lay-verify="maintenanceCycle" style="width:150px"></td>'+
		                	        '</tr>'+
		                	        '<tr style="height:20px"></tr>'+
		                	        '<tr>'+
		                	        	'<td><label class="layui-form-label left-label">日期</label></td>'+
		                	        	'<td><input class="layui-input" id="maintenanceTime" name="maintenanceTime" lay-verify="maintenanceTime" style="width:150px"></td>'+
		                	        	'<td><label class="layui-form-label left-label">所需材料</label></td>'+
		                	        	'<td><input class="layui-input" id="needMaterial" name="needMaterial" lay-verify="needMaterial" style="width:150px"></td>'+
		                	        '</tr>'+
		                	        '<tr style="height:20px"></tr>'+
		                	        '<tr>'+
		                	        	'<td><label class="layui-form-label left-label">单位</label></td>'+
		                	        	'<td><input class="layui-input" id="unit" name="unit" lay-verify="unit" style="width:150px"></td>'+
		                	        	'<td><label class="layui-form-label left-label">数量</label></td>'+
		                	        	'<td><input class="layui-input" id="counts" name="counts" lay-verify="counts" style="width:150px"></td>'+
		                	        '</tr>'+
		                	        '<tr style="height:20px"></tr>'+
		                	        '<tr>'+
		                	        	'<td><label class="layui-form-label left-label">工时</label></td>'+
		                	        	'<td><input class="layui-input" id="workHours" name="workHours" lay-verify="workHours" style="width:150px"></td>'+
		                	        	'<td><label class="layui-form-label left-label">人工</label></td>'+
		                	        	'<td><input class="layui-input" id="manPower" name="manPower" lay-verify="manPower" style="width:150px"></td>'+
		                	        '</tr>'+
		                	        '<tr style="height:20px"></tr>'+
		                	        '<tr>'+
		                	        	'<td><label class="layui-form-label left-label">费用(元)</label></td>'+
		                	        	'<td><input class="layui-input" id="cost" name="cost" lay-verify="cost" style="width:150px"></td>'+
                                        '<td><label class="layui-form-label left-label">录入人</label></td>'+
                                        '<td><input class="layui-input" id="remark01" name="remark01" lay-verify="remark01" style="width:150px"></td>'+
		                	        '</tr>'+
		                	        '<tr style="height:20px"></tr>'+
		                	        '<tr align="center">'+
		                	        	'<td colspan="2"><button class="layui-btn layui-btn-blue" id="subBtn" lay-submit lay-filter="addForm" style="margin-left:160px; margin-bottom: 20px">提交</button></td>'+
		                	        	'<td colspan="2">&emsp;&emsp;&emsp;&emsp;<button type="reset" class="layui-btn layui-btn-primary" style="margin-bottom: 20px">重置</button></td>'+
		                    		'</tr>'+
		                    	'</table>'+
                    	'</form>'+
                	'</div>'
                    ,success: function(){
                    	//日期
                        laydate.render({
                            elem: '#maintenanceTime'
                        });
                    	//下拉查找所有设备
    		  			$.ajax({
    		  	            type: 'POST',
    		  	            url: '${pageContext.request.contextPath}/device/queryAllDeviceList.do',
    		  	            dataType: 'json',
    		  	            async: false,
    		  	            success: function (data){
    		  	                for (var i = 0; i < data.length; i++) {
    		  	                    $("#deviceNo").append("<option value='"+ data[i].deviceNo +"'>"+ data[i].deviceNo +"</option>");
    		  	                }
    		  	            }
    		  	        });
                    	form.render();
                    }
                });
                break;
                //批量删除
                case 'delete':
                    var data = checkStatus.data;
                    var idArr = new Array();
                    if(data.length==0){
                        toastr.warning("请至少选择一条记录！");
                    }
                    for(var i=0;i<data.length;i++){
                        idArr[i] = data[i].id;
                    }
                    $.ajax({
                        type:'post',
                        url:'${pageContext.request.contextPath }/maintPlan/deleteMaintenancePlanById.do',
                        data:{"idArr" : idArr},
                        success:function(data){
                            layer.confirm('确定删除吗？', function(index){
                            	if(data > 0){
                                    toastrStyle();
                                    toastr.success("删除成功！");
                                    setTimeout(function(){
                                        location.reload();
                                    },1000);
                                }else{
                                    toastrStyle();
                                    toastr.warning("删除失败！");
                                    setTimeout(function(){
                                        location.reload();
                                    },1000);
                                }
                            });
                        }
                    });
                break;
                case 'select':
                    /*console.log(obj)*/
                break;
            };
        });

        //监听行工具事件
        table.on('tool(tableList)', function(obj){
            var data = obj.data;
            var idArr = new Array();
            /*console.log(obj)*/
            //单个删除
            if(obj.event === 'del'){
                layer.confirm('确定删除吗？', function(index){
                    var id = obj.data.id;
                    idArr[0] = id;
                    $.ajax({
                        type:'post',
                        url:'${pageContext.request.contextPath }/maintPlan/deleteMaintenancePlanById.do',
                        data:{ "idArr" : idArr },
                        success:function(data){
                            if(data > 0){
                                toastrStyle();
                                toastr.success("删除成功！");
                                setTimeout(function(){
                                    location.reload();
                                },1000);
                            }else{
                                toastrStyle();
                                toastr.warning("删除失败！");
                                setTimeout(function(){
                                    location.reload();
                                },1000);
                            }
                        }
                    })
                    layer.close(index);
                });
            } else if(obj.event === 'edit'){
            	$("#deviceNo1").find("option").not(":first").remove();
                layer.open({
                    type: 1 					//Page层类型
                    ,area: ['620px', '470px'] 	//宽  高
                    ,title: '编辑'
                    ,shade: 0.6 				//遮罩透明度
                    ,maxmin: true 				//允许全屏最小化
                    ,anim: 1 					//0-6的动画形式，-1不开启
                    ,content: '<div id="editDivID">' +
								'<form class="layui-form" id="editFormID">' +
									'<table>' +
										'<tr>' +
											'<td><input class="layui-hide" id="id" name="id" value="'+data.id+'"></td>' +
										'</tr>' +
										'<tr>' +
											'<td><label class="layui-form-label left-label" style="margin-top: 20px">设备编号</label></td>' +
											'<td>' +
                                                '<div style="width: 170px">'+
                                                    '<div style="width: 150px; margin-left: 0px; float: left; margin-top: 20px">' +
                                                        '<select disabled class="layui-select" id="deviceNo1" name="deviceNo" lay-filter="displayInfo" lay-verify="deviceNo">' +
                                                            '<option value="">请选择</option>' +
                                                        '</select>' +
                                                    '</div>' +
                                                    '<div style="margin-top: 29px; float: left">'+
                                                        '<font style="color:red; font-size: 24px; margin-left: 4px">*</font>'+
                                                    '</div>'+
                                                '</div>' +
											'</td>' +
											'<td><label class="layui-form-label left-label" style="margin-top: 20px">设备名称</label></td>' +
											'<td><input readonly class="layui-input" id="deviceName1" name="deviceName" value="'+data.deviceName+'" lay-verify="deviceName" style="width:150px; margin-top: 20px; display: inline;">' +
                                                '<div class="layui-inline" style="margin-top: 4px;">'+
                                                    '<font style="color:red; font-size: 24px; margin-left: 4px">*</font>'+
                                                '</div>'+
                                            '</td>' +
										'</tr>' +
										'<tr style="height:20px"></tr>' +
										'<tr>' +
											'<td><label class="layui-form-label left-label">维护维修内容</label></td>' +
											'<td><input class="layui-input" id="maintenanceContent1" name="maintenanceContent" value="'+data.maintenanceContent+'" lay-verify="maintenanceContent" style="width:150px"></td>' +
											'<td><label class="layui-form-label left-label">周期</label></td>' +
											'<td><input class="layui-input" id="maintenanceCycle1" name="maintenanceCycle" value="'+data.maintenanceCycle+'" lay-verify="maintenanceCycle" style="width:150px"></td>' +
										'</tr>' +
										'<tr style="height:20px"></tr>' +
										'<tr>' +
											'<td><label class="layui-form-label left-label">日期</label></td>' +
											'<td><input class="layui-input" id="maintenanceTime1" name="maintenanceTime" value="'+data.maintenanceTime+'" lay-verify="maintenanceTime" style="width:150px"></td>' +
											'<td><label class="layui-form-label left-label">所需材料</label></td>' +
											'<td><input class="layui-input" id="needMaterial1" name="needMaterial" value="'+data.needMaterial+'" lay-verify="needMaterial" style="width:150px"></td>' +
										'</tr>' +
										'<tr style="height:20px"></tr>' +
										'<tr>' +
											'<td><label class="layui-form-label left-label">单位</label></td>' +
											'<td><input class="layui-input" id="unit1" name="unit" value="'+data.unit+'" lay-verify="unit" style="width:150px"></td>' +
											'<td><label class="layui-form-label left-label">数量</label></td>' +
											'<td><input class="layui-input" id="counts1" name="counts" value="'+data.counts+'" lay-verify="counts" style="width:150px"></td>' +
										'</tr>' +
										'<tr style="height:20px"></tr>' +
										'<tr>' +
											'<td><label class="layui-form-label left-label">工时</label></td>' +
											'<td><input class="layui-input" id="workHours1" name="workHours" value="'+data.workHours+'" lay-verify="workHours" style="width:150px"></td>' +
											'<td><label class="layui-form-label left-label">人工</label></td>' +
											'<td><input class="layui-input" id="manPower1" name="manPower" value="'+data.manPower+'" lay-verify="manPower" style="width:150px"></td>' +
										'</tr>' +
										'<tr style="height:20px"></tr>' +
										'<tr>' +
											'<td><label class="layui-form-label left-label">费用(元)</label></td>' +
											'<td><input class="layui-input" id="cost1" name="cost" value="'+data.cost+'" lay-verify="cost" style="width:150px"></td>' +
                                            '<td><label class="layui-form-label left-label">录入人</label></td>'+
                                            '<td><input class="layui-input" id="remark01" name="remark01" value="'+data.remark01+'" lay-verify="remark01" style="width:150px"></td>'+
										'</tr>' +
										'<tr style="height:20px"></tr>' +
										'<tr align="center">' +
											'<td colspan="2"><button class="layui-btn layui-btn-blue" lay-submit lay-filter="editForm" style="margin-left:160px; margin-bottom: 20px">提交</button></td>' +
											'<td colspan="2">&emsp;&emsp;&emsp;&emsp;<button type="reset" class="layui-btn layui-btn-primary" style="margin-bottom: 20px">重置</button></td>' +
										'</tr>' +
										'</table>' +
									'</form>' +
								'</div>'
                    ,success: function(){
                        laydate.render({
                            elem: '#maintenanceTime1'
                        });
                      	//下拉查找所有设备
    		  			$.ajax({
    		  	            type: 'POST',
    		  	            url: '${pageContext.request.contextPath}/device/queryAllDeviceList.do',
    		  	            dataType: 'json',
    		  	            async: false,
                            success: function (datas){
                                for (var i = 0; i < datas.length; i++) {
                                    $("#deviceNo1").append("<option value='"+ datas[i].deviceNo +"'>"+ datas[i].deviceNo +"</option>");
                                    if(datas[i].deviceNo == data.deviceNo){
                                        $("#deviceNo1").val(data.deviceNo);
                                    }
                                }
                            }
    		  	        });
                      	form.render();
                    }
                });
            }
        });

        /**
         * 通用表单提交(AJAX方式)(新增)
         */
        form.on('submit(addForm)', function (data) {
        	$("#subBtn").attr("disabled",true);
            $.ajax({
                url : '${pageContext.request.contextPath}/maintPlan/addMaintenancePlan.do',
                data: $("#addFormID").serialize(),
                cache : false,
                type : "post",
            }).done(
                function(res) {
                    if (res > 0) {
                        toastrStyle();
                        toastr.success('新增成功！');
                        setTimeout(function(){
                            location.reload();
                        },1000);
                    }
                }
            ).fail(
                function(res) {
                    toastrStyle();
                    toastr.error('新增失败！');
                    setTimeout(function(){
                        location.reload();
                    },1000);
                }
            )
            return false;
        });
        /**
         * 通用表单提交(AJAX方式)(修改)
         */
        form.on('submit(editForm)', function (data) {
            $("#deviceNo1").removeAttr("disabled");
            $.ajax({
                url : '${pageContext.request.contextPath}/maintPlan/editMaintenancePlanById.do',
                data: $("#editFormID").serialize(),
                cache : false,
                type : "post",
            }).done(
                function(res) {
                    if (res > 0) {
                        toastrStyle();
                        toastr.success('修改成功！');
                        setTimeout(function(){
                            location.reload();
                        },1000);
                    }
                }
            ).fail(
                function(res) {
                    toastrStyle();
                    toastr.error('修改失败！');
                    setTimeout(function(){
                        location.reload();
                    },1000);
                }
            )
            return false;
        });

        /**
         * 新增表单校验
         */
        form.verify({
            //value：表单的值item：表单的DOM对象
            deviceName: function(value, item){
                if(value == ''){
                    return '设备名称不能为空';
                }
            },
            deviceNo: function(value, item){
                if(value == ''){
                    return '设备编号不能为空';
                }
            }/* ,
            maintenanceContent: function(value, item){
                if(value == ''){
                    return '维修维护内容字段不能为空';
                }
            },
            maintenanceCycle: function(value, item){
                if(value == ''){
                    return '周期字段不能为空';
                }
            },
            maintenanceTime: function(value, item){
                if(value == ''){
                    return '日期字段不能为空';
                }
            },
            needMaterial: function(value, item){
                if(value == ''){
                    return '所需材料不能为空';
                }
            },
            unit: function(value, item){
                if(value == ''){
                    return '单位字段不能为空';
                }
            },
            counts: function(value, item){
                if(value == ''){
                    return '数量字段不能为空';
                }
            },
            workHours: function(value, item){
                if(value == ''){
                    return '工时字段不能为空';
                }
            },
            manPower: function(value, item){
                if(value == ''){
                    return '人工字段不能为空';
                }
            },
            cost: function(value, item){
                if(value == ''){
                    return '费用字段不能为空';
                }
            } */
        });

      	//查找带回
        form.on('select(displayInfo)', function(data){
        	$.ajax({
                type: 'POST',
                url: '${pageContext.request.contextPath}/device/queryDeviceInfoByNo.do',
                data: {deviceNo:$('#deviceNo').val()},
                /* dataType: 'json', */
                /* async: false, */
                success: function (data){
                	var device = eval('(' +data+ ')');
                	$('#deviceName').val(device.deviceName);
                }
            });
        });
    });
    toastr.options.positionClass = 'toast-top-center'; //提示框的位置设置为中上
    //提示框样式
    function toastrStyle(){
        toastr.options = {
            "closeButton": false,
            "debug": false,
            "newestOnTop": false,
            "progressBar": false,
            "positionClass": "toast-top-center",
            "preventDuplicates": false,
            "onclick": null,
            "showDuration": "5000",
            "hideDuration": "1000",
            "timeOut&quot": "100000",
            "extendedTimeOut": "0",
            "showEasing": "swing",
            "hideEasing": "linear",
            "showMethod": "fadeIn",
            "hideMethod": "fadeOut"
        };
    }
</script>

</body>
</html>